import { Form } from 'vant';
import { createRouter, createWebHashHistory, createWebHistory } from 'vue-router';
//导入组件 
import Login from '../components/login.vue'
// import Test from '../components/test.vue'     
import MapContainer from '../components/MapContainer.vue'


// 1.创建路由规则
const routes = [
    {
        path: '/',
        redirect: '/login'       //地址重定向到login
    },
    {
        path: '/login',
        component: Login,      // 通过组件直接显示,或者也可以下面的形式也是可以
        // component: () => import('../views/login/login_index.vue')
    },

    {
        path: '/MapContainer',
        name: 'MapContainer',
        component: MapContainer
    }
    ,
    {
        //二级目录
        path: '/home',
        name: 'home',
        // 跳转到HOME页面 整体的页面
        component: () => import('../components/home.vue'),
        // component:Home,
        redirect:'/board',     //页面默认加载的路由

        children: [
            {
                path: '/board',  //概览
                name: 'board',
                component: () => import('../components/board.vue')        //使用的是组件  
            },

            {
                path: '/devicemanager',    //设备管理
                name: 'devicemanager',
                component: () => import('../components/device_vue.vue')
            },
            {
                path: '/autotest',
                name: 'autotest',
                component: () => import('../views/Home/autotest/index.vue')
            },
            {
                path: '/inquiries',   // 用例库查询
                name: 'inquiries',
                component: () => import('../components/testcase/inquiries.vue')
            },
          
            //新增左侧自动化测试栏
            {
                path: '/app',      //app
                name: 'APP',
                component: () => import('../components/appauto_index.vue')
            },
           
            {
                path: '/web',   //web  ui
                name: 'web',
                component: () => import('../views/Home/autotest/webauto_index.vue')
            },

            // {
            //     path: '/web/prolist',   //web  ui project list 
            //     name: 'prolist',
            //     component: () => import('../views/Home/autotest/projectboard/project_list.vue')
            // },

            {
                path: '/operationdev',   //运维操作
                name: 'operationdev',
                component: () => import('../components/operationdev.vue')
            },

        
            {
                path: '/upload',   //文件上传
                name: 'upload',
                component: () => import('../components/upload/upload_index.vue')
            },
            {
                path: '/userinfo',   //用户管理
                name: 'userinfo',
                component: () => import('../views/Home/user/userinfo.vue')
            },



        ]

    },

]

// 2.创建路由实例
const router = createRouter(
    {
        // history: createWebHistory(),     // hash 模式是用createWebHashHistory()创建的
        history: createWebHashHistory(),     // hash 模式是用createWebHashHistory()创建的
        mode: 'history',
        routes  //路由规则,  

        //vue-router 默认是hash模式  ,url中有# hash值(#后面的值),不会包括在http请求中,改变hash值不会影响页面的重新加载 
        // history 模式, url不带参数 ,history 模式需要后端配合,所有访问都指向index ,否则用户刷新页面 ,会导致404 错误  .
        //用createWebHistory()创建 HTML5 模式
        // vue2 去掉地址栏里的#只需要将原来默认的mode的hash改为history模块即可 .,
        // vue3去掉地址栏里的# 只需要将原来默认的createWebhashHistory 改为createWebHistory即可.

    }
);

//挂载路由导航守卫功能  https://download.csdn.net/download/weixin_38711643/12923471?utm_medium=distribute.pc_relevant_download.none-task-download-2~default~BlogCommendFromBaidu~Rate-2-12923471-download-12951709.topnsimilar_compare_v2&depth_1-utm_source=distribute.pc_relevant_download.none-task-download-2~default~BlogCommendFromBaidu~Rate-2-12923471-download-12951709.topnsimilar_compare_v2&dest=https%3A%2F%2Fdownload.csdn.net%2Fdownload%2Fweixin_38711643%2F12923471&spm=1003.2020.3001.6616.2
router.beforeEach((to, from, next) => {
    // to  是要访问的如今
    // from 代表从哪个路径跳转过来的
    // next 是一个函数 , 表示放行   next() 放行 , next('/login) 强制跳转
    if (to.path === '/login') {     //如果跳转是登录 ,就放行 
        return next();
    }
    else {
        // 获取到token这里 ,就放开下面的代码 ,获取token
        //获取到token  
        // const token = window.sessionStorage.getItem('token')
        // if (token ==null || token ==="") {
        //     console.log('请先登录');
        //     next('/login')
        // }else
        // {
        next();
        // }


    }




})

export default router;
// 3.创建登录组件
//在views中创建index .vue
// 4.指定出口




